<template>
    <div class="form_item">
        <!-- <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">上传身份证</div>
        </div> -->
        <!-- <div class="form_query">
            <div class="count">
                <div class="upload_file flex-column">
                    <van-uploader :after-read="afterRead" v-model="formParams.frontList" :max-count="1"
                        :preview-size="['44.8vw', '24vw']">
                        <div class="upload_pic">
                            <div class="pic_icon">
                                <img src="../../../assets/real/pic.png" alt="" />
                            </div>
                            <div class="pic_desc">上传身份证头像面</div>
                        </div>
                    </van-uploader>
                </div>
                <div class="upload_file flex-column">
                    <van-uploader :after-read="afterRead" v-model="formParams.reverList"
                        :preview-size="['44.8vw', '24vw']" :max-count="1">
                        <div class="upload_pic">
                            <div class="pic_icon">
                                <img src="../../../assets/real/pic.png" alt="" />
                            </div>
                            <div class="pic_desc">上传身份证国徽面</div>
                        </div>
                    </van-uploader>
                </div>
            </div>
        </div> -->
    </div>
    <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">姓名</div>
        </div>
        <div class="form_query">
            <van-field v-model="formParams.name" placeholder="请输入真实姓名" />
        </div>
    </div>
    <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">身份证号码</div>
        </div>
        <div class="form_query">
            <van-field v-model="formParams.idCard" placeholder="请输入正确的身份证号码" />
        </div>
    </div>
    <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">手机号码</div>
        </div>
        <div class="form_query">
            <van-field v-model="formParams.mobile" placeholder="请输入手机号码" />
        </div>
    </div>
    <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">支付宝账号</div>
        </div>
        <div class="form_query">
            <van-field v-model="formParams.cardNo" placeholder="请输入支付宝账号" />
        </div>
    </div>
    <!-- <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">身份证有效期</div>
        </div>
        <div class="form_query date_count">
            <div class="date flex-row">
                <van-field v-model="formParams.date" placeholder="年/月/日">
                    <template #button>
                        <van-checkbox style="margin-left: 30px" icon-size="14px" v-model="formParams.longVidty"><span
                                style="font-size: 14px; color: #333">长期有效</span></van-checkbox>
                    </template>
                </van-field>
            </div>
            <div class="date_icon" @click="openDatePicker()">
                <img src="../../../assets/real/date_icon.png" />
            </div>
        </div> 
    </div> -->

    <!-- <div class="form_item">
        <div class="form_title">
            <div class="lf_icon">
                <img src="../../../assets/real/right_sj.png" alt="" />
            </div>
            <div class="font_title">验证码</div>
        </div>
        <div class="form_query verify">
            <div class="ver_lf">
                <van-field v-model="formParams.verifyCode" placeholder="请输入验证码" />
            </div>
            <div class="ver_rg" @click="getCode()">
                {{ codeMesg }}
            </div>
        </div>
    </div> -->
    <!-- 选择日历 -->
    <!-- <van-calendar color="#FE5F6C" @confirm="selectDate" switch-mode="year-month" v-model:show="showDatePicker" /> -->
</template>
<script setup lang="ts">
import { ref,defineExpose } from "vue";
// import * as dayjs from "dayjs";
const formParams = ref({
    // frontList: [],
    // reverList: [],
    // verifyCode: "",
    // longVidty: false,
    // date: "",
    name: "",
    idCard: "",
    mobile: "",
    cardNo:"",
});
// const showDatePicker = ref(false);
// const sendType = ref(true);
// const codeMesg = ref("发送验证码");
// const afterRead = (file) => {
//     // 此时可以自行将文件上传至服务器
//     console.log(file);
// };
// 点击确定按钮回调
// const selectDate = (dateVal: Date) => {
//     formParams.value.date = dayjs(dateVal).format("YYYY/MM/DD");
//     showDatePicker.value = false;
// };
// // 打开日历弹窗
// const openDatePicker = () => {
//     showDatePicker.value = true;
// };

// const getCode = () => {
//     // 发送验证码
//     if (sendType.value) {
//         sendType.value = false;
//         codeMesg.value = "10秒后重新发送";
//         let time = 9;
//         let timer = setInterval(() => {
//             if (time == 0) {
//                 clearInterval(timer);
//                 codeMesg.value = "重新发送验证码";
//                 sendType.value = true;
//             } else {
//                 codeMesg.value = time + "秒后重新发送";
//                 time--;
//             }
//         }, 1000);
//     }
// };
defineExpose({
    formParams
})
</script>
<style lang="less" scoped>
@import "../index.less";
</style>